<template>
        <nav class="haibei-nav">
            <ul class="nav-list clearfix">
                <li>
                    <router-link :to="{name:'index'}"  style="border-bottom:0;"><img src="/static/images/logo.png"  alt=""></router-link>
                
                </li>
                <li>
                    <router-link :to="{name:'index'}">首页</router-link>
                    <!-- <a href="/home" :class="[active==='index'?'is-active':'']">首页</a> -->
                </li>
                <li>
                    <router-link :to="{name:'download'}">下载专区</router-link>
                    <!-- <a href="/download" :class="[active==='download'?'is-active':'']">下载专区</a> -->
                </li>
                <li>
                    <router-link :to="{name:'guide'}">新手指南</router-link>
                    <!-- <a href="/guide" :class="[active==='guide'?'is-active':'']">新手指南</a> -->
                </li>
                <!-- <li>
                    <a href="./community.html" :class="[active==='community'?'is-active':'']">社区动态</a>
                </li> -->
            </ul>
        </nav>
</template>
<style scoped>
.haibei-nav {
    height: 70px;
    position: fixed;
    width: 100%;
    background: #fff;
}

.nav-list {
    width: 1002px;
    margin: 0 auto;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.nav-list li {
    float: left;
}

.nav-list a {
    display: block;
    padding: 0 30px;
    line-height: 68px;
    color: #000;
    border-top: 2px solid #fff
}
img{
    display: block;
}
.nav-list a:hover {
    border-top: 2px solid #3498db
}
.nav-list .router-link-active{
    color: #3498db
}
</style>

<script>
    export default{
        props:{
            active:{
                type:String,
                default:''
            }
        }
    }

</script>


